<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
	<title>Symmetry: Interactive presentation framework</title>
	<meta http-equiv="Content-type" content="text/html;charset=UTF-8">
	<link rel="stylesheet" type="text/css" href="styles.css" />
	<link rel="stylesheet" type="text/css" href="tinybox2/style.css" />
	<link type="text/css" rel="StyleSheet" href="slider/slider.css" />

	<script type="text/x-mathjax-config">
	  MathJax.Hub.Config({tex2jax: {inlineMath: [['$','$'], ['\\(','\\)']]}});
	</script>
	<script type="text/javascript" src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML">
	</script>

	<script src="tinybox2/tinybox.js" type="text/javascript"></script>
	<script type="text/javascript" src="slider/range.js"></script>
	<script type="text/javascript" src="slider/timer.js"></script>
	<script type="text/javascript" src="slider/slider.js"></script>

	<script type="text/javascript" src="Chart.js"></script>

	<script type="text/javascript" src="colors.js"></script>
	<script src="glMatrix.js" type="text/javascript"></script>
	<script src="webgl-utils.js" type="text/javascript"></script>
	<script src="webgl.js" type="text/javascript"></script>
	<script src="polygon.js" type="text/javascript"></script>
	<script src="coord_axes.js" type="text/javascript"></script>
	<script src="lin_eq.js" type="text/javascript"></script>
	<script src="scene.js" type="text/javascript"></script>
	<script src="linear_geometry.js" type="text/javascript"></script>
	<script src="dihedral.js" type="text/javascript"></script>
	<script src="curve.js" type="text/javascript"></script>
	<script src="surface.js" type="text/javascript"></script>
	<script src="plotting.js" type="text/javascript"></script>
	<script src="slide_geometry.js" type="text/javascript"></script>
	<script src="pres_vis_fg.js" type="text/javascript"></script>



	<script src="poly_command_panel.js" type="text/javascript"></script>
	<script src="plotting_command_panel.js" type="text/javascript"></script>
	<script src="vecmat_command_panel.js" type="text/javascript"></script>
	<script src="lineq_command_panel.js" type="text/javascript"></script>
	<script src="command_panel.js" type="text/javascript"></script>
	<script src="pres_cmd_mng.js" type="text/javascript"></script>
	<script src="toolbox.js" type="text/javascript"></script>
	
	<!-- shaders -->
	<script id="shader-fs" type="x-shader/x-fragment"> 
		#ifdef GL_ES
		precision mediump float;
		#endif

		uniform float uUseTexture;
		varying vec4 vColor;

		uniform float uAlpha;

		varying vec2 vTextureCoord;
		uniform sampler2D uSampler;

		void main(void) 
		{
			vec4 texColor = texture2D(uSampler, vTextureCoord) * uUseTexture;
			vec4 vertColor = vColor * (1.0 - uUseTexture);
			vec4 final_texColor = vec4(texColor.rgb, texColor.a * uAlpha);
			gl_FragColor = final_texColor + vertColor;
		}
	</script> 
	<script id="shader-vs" type="x-shader/x-vertex"> 
		attribute vec3 aVertexPosition;
		attribute vec2 aTextureCoord;
		attribute vec4 aVertexColor;

		varying vec4 vColor;
		varying vec2 vTextureCoord;

		uniform mat4 uMVMatrix;
		uniform mat4 uPMatrix;

		void main(void)
		{
			gl_Position = uPMatrix * uMVMatrix * vec4(aVertexPosition, 1.0);
			vTextureCoord = aTextureCoord;
			vColor = aVertexColor;
		}
	</script> 

</head>

<body id="body_pres_id" bgcolor="white" onmouseup="ToolBox.hideContextMenu()">
<input id="session_key_id" type="hidden" name="hidden" value="00"></input>

<div class="back_button">
<a id="back_id" href="/index.html" >Back to main page</a>
</div>

<div class='left_menu'>
<div class='left_menu_in'>
<a href="#" class="toolbox_button add" onclick="ToolBox.addSlide()">Add New Slide</a>
<a href="#" class="toolbox_button copy" onclick="ToolBox.addSlide()">Duplicate Slide</a>
<a href="#" class="toolbox_button delete_current" onclick="ToolBox.deleteLastSlide()">Delete Slide</a>
<a href="#" class="toolbox_button delete" onclick="ToolBox.deleteLastSlide()">Remove Last Slide</a>
<hr width="90%">
Theme:
<label class="boxlabel">
	<select class="boxselect">
		<option selected="selected">Berlin(White - Blue)</option>
	</select>
</label>
Transition:
<label class="boxlabel">
	<select id="vis_sel_id" class="boxselect">
		<option selected="selected">Simple</option>
		<option>Fading</option>
		<option>Dynamic(3d accelerated)</option>
		<option>Paper(3d accelerated)</option>
		<option>Particles(3d accelerated)</option>
	</select>
</label>
<a href="#" onclick="ToolBox.preview()" class="toolbox_button preview">Play</a>
<a href="#" onclick="ToolBox.preview()" class="toolbox_button slideshow">Slide Show</a>
<a href="#" onclick="ToolBox.submitPresCommand('save')" class="toolbox_button save">Save</a>
<br/>
Name: <input type="text" id='pres_name_id' size="18"></input>
<a href="#" onclick="ToolBox.submitPresCommand('download')" class="toolbox_button download">Download(PDF)</a>
<hr width="90%">
Cursor:
<label class="boxlabel">
	<select id="cursor_sel_id" class="boxselect" onchange="ToolBox.onCursorChange(this)">
		<option selected="selected">Select</option>
		<option>Insert</option>
		<option>Move & Resize</option>
	</select>
</label>
<a href="#" onclick="ToolBox.editTitle()" class="toolbox_button title">Slide Title...</a>
<a href="#" onclick="" class="toolbox_button pagesz">Slide Size</a>
<hr width="90%">
<a href="#" class="toolbox_button undo">Undo</a>
<a href="#" class="toolbox_button redo">Redo</a>
</div>
</div>

<div id = "slides_id">
	<div id="slide_id_1" class="slide_div" onclick="ToolBox.showContextMenu(event)">
	</div>
	<div id="slidenav_id" class="slidenav">
		<a href="#" onclick="ToolBox.prevSlide()">&#171;&nbsp;Previous</a>
		<input readonly type="text" id='slide_no_id' size="3" value="1/1"></input>
		<a href="#" onclick="ToolBox.nextSlide()">Next&nbsp;&#187;</a>
	</div>
</div>

<div id="context_menu_id" class="context_menu">
	<ul class="list" data-header="Insert">
	
		<li id="text" onclick="ToolBox.addTextArea()">Text Area</li>

		<li id="paragraph" onclick="TINY.box.show({url:'paragraph.html',width:600,height:380})">Paragraph</li>

		<li id="bullets" onclick="ToolBox.cmenuSelection(this.id)">Bullets</li>

		<li id="image" onclick="ToolBox.cmenuSelection(this.id)">Image</li>

		<li id="code_box" onclick="ToolBox.cmenuSelection(this.id)">Code Box</li>
		
		<li id="math" onclick="TINY.box.show({url:'math_elem.html',width:600,height:380})">Math Element</li>

		<li id="sketch" onclick="ToolBox.cmenuSelection(this.id)">3D Sketch</li>

		<li id="chart" onclick="TINY.box.show({url:'chart_elem.html',width:600,height:380})">Chart</li>
		
		<li id="simulation" onclick="ToolBox.cmenuSelection(this.id)">Simulation</li>
	</ul>
</div>

<div class="right_menu">
	<br/><br/>
	<li><a href='#' onclick="window.location.reload()"><span>Create new</span></a></li>
	<li><a href='#' onclick="ToolBox.submitPresCommand('dir')"><span>Open</span></a></li>
	<li><a href='#'><span>Upload ...</span></a></li>
	<li><a href='#'><span>Help</span></a></li>
	<br/><br/>
</div> 

<div align="center" id="final" style="text-align:center; position: fixed; bottom: 0;">Andrei Milea 2013</div>
<canvas id ='textCanvas' style="border: 1px solid #aaa; display: none;" width="512" height="64"></canvas>
</body>

</html>


